<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="" />
<meta name="format-detection" content="telephone=no">
<title>积分商城</title>
<link rel="stylesheet" href="../css/time.css">
<link rel="stylesheet" href="../css/time/time.css">
<link rel="stylesheet" href="../js/layui/css/layui.css">
<%@ include file="../general.jsp"%>
</head>
<body ontouchstart>
	<section class="ui-container">
	<div class="con_top1" id="con_top1">
	<c:choose>
		<c:when test="${issign==0}">
			<a href="javascript:addsign();" style='background: #d3af30;' id="con_a">签到</a>
		</c:when>
		
		<c:otherwise>
			<a href="#" style='background: #393939;'>已签到</a>
		</c:otherwise>
	</c:choose>
	</div>
	<div class="con_time">
		<div class="con_time_top con_time_in">
			<span></span>
			<ul class="con_ul">
				<li id="a1_in"><a href="#" class="con_not"><div class="con_li"><i class="jiafen1 jiafen" style="display: none;">+10</i><i class="weiqiandao1 weiqiandao">未签到</i><br /><div id="a1">星期一</div></div></a></li>
				<li id="a2_in"><a href="#" class="con_not"><div class="con_li"><i class="jiafen2 jiafen" style="display: none;">+10</i><i class="weiqiandao2 weiqiandao">未签到</i><br /><div id="a2">星期二</div></div></a></li>
				<li id="a3_in"><a href="#" class="con_not"><div class="con_li"><i class="jiafen3 jiafen" style="display: none;">+10</i><i class="weiqiandao3 weiqiandao">未签到</i><br /><div id="a3">星期三</div></div></a></li>
				<li id="a4_in"><a href="#" class="con_not"><div class="con_li"><i class="jiafen4 jiafen" style="display: none;">+10</i><i class="weiqiandao4 weiqiandao">未签到</i><br /><div id="a4">星期四</div></div></a></li>
			</ul>
		</div> 
		<div class="con_time_bottom con_time_in">
			<span></span>
			<ul class="con_ul">
				<li id="a5_in"><a href="#" class="con_not"><div class="con_li"><i class="jiafen5 jiafen" style="display: none;">+10</i><i class="weiqiandao5 weiqiandao">未签到</i><br /><div id="a5">星期五</div></div></a></li>
				<li id="a6_in"><a href="#" class="con_not"><div class="con_li"><i class="jiafen6 jiafen" style="display: none;">+10</i><i class="weiqiandao6 weiqiandao">未签到</i><br /><div id="a6">星期六</div></div></a></li>
				<li id="a7_in"><a href="#" class="con_not"><div class="con_li"><i class="jiafen7 jiafen" style="display: none;">+10</i><i class="weiqiandao7 weiqiandao">未签到</i><br /><div id="a7">星期天</div></div></a></li>
				<li class="a8_in">
					<!-- <div class="layui-inline" style="width: 1.7rem;height: 1.7rem;position: absolute;">
                       <input class="layui-input" id="layui-laydate-input" autocomplete="off"  onclick="layui.laydate({elem: this, istime: true, format: 'YYYY-MM-DD hh:mm:ss'})" style="height: 100%; border-radius: 50%;font-size: 0; background: none;border:none;">
                    </div> -->
					<a href="#" class="con_not"><div class="con_li"><img src="../images/rli.png" id="layui-img" onclick="layui.laydate({elem: this, istime: true, format: 'YYYY-MM-DD hh:mm:ss'})" alt="" /><br />签到日历</div></a>
				</li>
			</ul>
		</div>
	</div>
	<div class="loading loading_time" id="loading"><a href="#">本周已持续签到<span>0</span>天</a></div>
	<div class="return_btn">
		<a href="#">
			<div class="return_btn_in">
				<img src="../images/weip.png" alt="">  
				<p>（返回微交易）</p>
			</div>
		</a>
	</div>  
	</section>
	<!-- <span style="color:#fff; font-size: 0.8rem;position:fixed;top: 19%; right: 8%; z-index: 100000000; display: none;" id="gb">X</span> -->
	<!-- /.ui-container-->
	<div class="bj"></div>
	<input type="hidden" name="${_csrf.parameterName}"  value="${_csrf.token}" />
</body>
</html>
<script src="../js/layui/layui.js"></script>
<script>
window.onload=function()
{
	getsign1();
	/* getsign(); */ 
}
	layui.use('laydate', function(){
	  var laydate = layui.laydate;
	  $('#layui-img').click(function(){
		  getsign();
		  $('.laydate_choose').click(function(){
			  getsign();
		  })
		  $('#laydate_table tr td').click(function(){
			  $('#laydate_box').css('display','none'); 
			  $(".bj").css('display','none');
		  })
		  $(".bj").css('display','block');
	  }) 
	  $('.bj').click(function(){
		  $(".bj").css('display','none');
	  })
	});
	
	function show(){	
		var a=layui.laydate({
			elem: document.getElementById('layui-img'),
			start: '2013-05-15',
			min: '2016-12-02 13:00:00', //最小日期
			max: '2016-12-05 13:59:59', //最大日期
			festival: true, //是否显示节日
			issure: true	
		})	
		showa();
	}
	function showa(){
		//获取年
		var aa=document.getElementById('laydate_y');
		//获取月
		var bb=document.getElementById('laydate_m');	
	}
/* 在日历插件中显示签到标签 */
	function getsign() {
		$.ajax({
			type : 'POST',
			url : "getUserSignRecord.do",
			data : {
				"_csrf" : $('[name="_csrf"]').val()
			},
			async : 'true',
			dataType : 'json',
			success : function(data) {
				var rec = data.item;
				var html="";
				//alert(JSON.stringify(rec));
				for(var i=0;i<rec.length;i++){
					var date=rec[i].createDt;
					/* console.log(date); */
					/* 把获取的签到日期截取 */
					var y=date.substring(0,4);  //2016 年
					var m=date.substring(5,7);  //12 月
					var d=date.substring(8,10);  //07 日
					//alert(y+"-"+m+"-"+d);
				//判断签到日是否以0开头
					var fdStart = d.indexOf("0");
					if(fdStart == 0){
					   //表示d是以0开头；
					   //alert(d.slice(1))
					   var dd = d.slice(1);
					   //alert(dd);					   
					}else if(fdStart == -1){
					  // 表示d不是以0开头
						var cc = d.slice(0,2);
					}
					/* 显示签到的日期时间 */
				 	html += rec[i].createDt+"----------";
			
   				/* 获取触发左右选择日期的按钮获取input中的值； */
   					var input = document.getElementById('laydate_m').value;
   					var input1=input.substring(0,2);  //12 月
   					//console.log(input1);
   				/* 把不是本月的日清空 */		
   					$(".laydate_nothis").html("");
   					
   			/* 获取本月开始日期结束 */		
					if( m == input1){
						$("#laydate_table").find("tr").each(function(da){
							//alert($(this).html());
							$(this).find("td").each(function(da){
								//alert($(this).attr("y"));
								//alert($(this).attr("m"));
								//alert($(this).attr('d'));
								//判断年月日是否等于签到的年月日
								if($(this).attr("y") == y && $(this).attr("m") == m && $(this).attr("d") == dd){
									$(this).addClass("td1");
								}
								if($(this).attr("y") == y && $(this).attr("m") == m && $(this).attr("d") == cc){
									$(this).addClass("td1");
								}
								//alert($(this).html());	
							});
						}); 
					}  	
				}
			}
		});
	}
/* 页面中的星期签到展示 */
	function getsign1() {
		$.ajax({
			type : 'POST',
			url : "getUserSignRecord.do",
			data : {
				"_csrf" : $('[name="_csrf"]').val()
			},
			async : 'true',
			dataType : 'json',
			success : function(data) {
				var rec = data.item;
				var html="";
				for(var i=0;i<rec.length;i++){
					var date=rec[i].createDt;
					/* 把获取的签到日期截取 */
					var d=date.substring(8,10);
					var tt=date.substring(11,19);
					console.log(d + "签到日期");
					/* 显示签到的日期时间 */
				 	html += rec[i].createDt+"----------";
					
				 /* 判断签到日期是星期几，并改变签到的样式 */
				 	var weekDay = '星期天,星期一,星期二,星期三,星期四,星期五,星期六'.split(',');
			        var dateStr = date; 
			        var begintime = dateStr.substring(0,10);
			        var qdao = dateStr.substring(8,10);
			        //alert(qdao);
			        var myDate = new Date(Date.parse(begintime)); 
					/* console.log(dateStr + '-------dateStr');
					console.log(myDate + '------myDate');
					console.log(weekDay[myDate.getDay()] + '-------签到的星期几'); */
					
			        var a1 = document.getElementById("a1").innerHTML;
			        var a2 = document.getElementById("a2").innerHTML;
			        var a3 = document.getElementById("a3").innerHTML;
			        var a4 = document.getElementById("a4").innerHTML;
			        var a5 = document.getElementById("a5").innerHTML;
			        var a6 = document.getElementById("a6").innerHTML;
			        var a7 = document.getElementById("a7").innerHTML;
			    /*获取本周周一的开始日期  */
			        var DAY = '星期天,星期一,星期二,星期三,星期四,星期五,星期六'.split(',');
			        var time = new Date();
			        msg = [];
			        msg.push('今天是:\t' + time.toISOString() + '\t' + DAY[time.getDay()]);
			    /* 本周开始的日期 */
			        time.setDate(time.getDate() - time.getDay() + 1);
			        msg.push('本周一的日期为:\t' + time.toISOString());
		        	var DD = time.toISOString();
		        	//var DD = "2016-12-05T01:34:41.120Z";
		        	//console.log(DD + "每周一的日期");     //2016-12-05T01:49:56.170Z  日期格式
		        	//alert(DD);
				    var D = DD.substring(8,10);
				    //alert(D);
	    	   
				 /* 转换成数组 */
				    var data1 = [D];   			//本周开始日期		   
				    var data2 = [];					//签到日期
				    //console.log(data1);
				    
			/* 本周周一的日期 */
				    for(var y = D;y <= D;y++){
				    	 console.log(y + "----");
				    	 data2.push(d);    //把签到日期添加到数组中
				    	//alert(1);
					     //console.log(data2);
					     if( data2 >= data1){
					    	 //alert(1);
						        /* 获取已持续签到天数 */
					        	var n = $('.loading_time span').text(); 
						        if( data2 == qdao ){
						        	//alert(1);
						        	n++;
						        	$(".loading_time span").text(n);
						        }
						        qiandao();
					        	/*alert(msg.join('n'));*/
						        /* 判断签到日期是星期几，并对应上页面中的星期把签到的日期展示出来 */
						        function qiandao(){
						        	if( a1 == weekDay[myDate.getDay()]){
							        	$('.con_ul #a1_in a').removeClass('con_not');
							        	$('.jiafen1').show();
							        	$('.weiqiandao1').hide();	        	
							        }
							        if( a2 == weekDay[myDate.getDay()]){
							        	$('.con_ul #a2_in a').removeClass('con_not');
							        	$('.jiafen2').show();
							        	$('.weiqiandao2').hide();
							        }
							        if( a3 == weekDay[myDate.getDay()]){
							        	$('.con_ul #a3_in a').removeClass('con_not');
							        	$('.jiafen3').show();
							        	$('.weiqiandao3').hide();
							        }
							        if( a4 == weekDay[myDate.getDay()]){
							        	$('.con_ul #a4_in a').removeClass('con_not');
							        	$('.jiafen4').show();
							        	$('.weiqiandao4').hide();
							        }
							        if( a5 == weekDay[myDate.getDay()]){
							        	$('.con_ul #a5_in a').removeClass('con_not');
							        	$('.jiafen5').show();
							        	$('.weiqiandao5').hide();
							        }
							        if( a6 == weekDay[myDate.getDay()]){
							        	$('.con_ul #a6_in a').removeClass('con_not');
							        	$('.jiafen6').show();
							        	$('.weiqiandao6').hide();
							        }
							        if( a7 == weekDay[myDate.getDay()]){
							        	$('.con_ul #a7_in a').removeClass('con_not');
							        	$('.jiafen7').show();
							        	$('.weiqiandao7').hide();
							        }
					        	}
						 }
					    
				     }
				
			        }			    
			}
		});
	}
	//页面加载时绑定按钮点击事件
	/* $(function(){
	    $("#con_a").click(function(){
	    	addsign();
	        refresh();
	    });
	}); */
	//点击按钮调用的方法
	function refresh(){
	    window.location.reload();//刷新当前页面.
	} 
	
	function addsign(){
		$.ajax({
			type : 'POST',
			url : "addSign.do",
			data : {
				"_csrf" : $('[name="_csrf"]').val()
			},
			async : 'true',
			dataType : 'json',
			success : function(data) {
				if(data.signresult==1){
					getsign();
					refresh();
					$("#con_top1").html("<a href='#'>已签到</a>");
				}else if(data.signresult==0){
					alert("签到失败");
				}else if(data.signresult==2){
					alert("重复签到");
				}	
			}
		});
	}
</script>